<!--
    Powered By nodePPT - This is probably the best web presentation tool so far!
    version: <%= nodeppt_version %>
    site: <%= nodeppt_site %>
    date: <%= date %>
-->
<!doctype html>
<html>
<head>
    <meta charset="UTF-8">
    <title><%= title %> - By <%= speaker %></title>
    <link rel="stylesheet" media="all" href="/css/nodeppt.css">
    <link rel="stylesheet" media="only screen and (max-device-width: 480px)" href="/css/phone.css">
    <%if (query && (query.print || query.pdf)) {%>
        <link rel="stylesheet" media="all" href="/css/pdf.css">
    <%}%>
    <link rel="stylesheet" href="/js/highlight/styles/<%if (hasOwnProperty('highlightStyle') && highlightStyle!=='') { %><%- highlightStyle %><% }else{%>monokai_sublime<%}%>.css">
    <link rel="stylesheet" href="/css/font-awesome.css">
    <%- headFiles %>
</head>
<body>
<div class="slides">
    <slides id="container">
        <%- content %>
        <%if (query && query.withThanks) {%>
        <slide class="slide thank-you-slide segue nobackground">
            <article class="flexbox vleft auto-fadein">
                <h2>Q &amp; A</h2>
                <h3>&lt;Thank You!&gt;</h3>
            </article>
        </slide>
        <%}%>

        <!-- <slide class="slide logoslide dark nobackground">
            <article class="flexbox vcenter">
                <h2 style="color: white;">Powered By nodePPT v<%= nodeppt_version %></h2>
            </article>
        </slide> -->
        <div class="slideTip" id="tip"></div>
    </slides>
</div>
<canvas id="drawBoard" class="draw-board" width="900" height="700"></canvas>
<div class="progress"><span id="progress"></span></div>
<div id="_buttons">
    <div class="_btn-box" id="_btn-box" style="display:none;">
        <button class="fa fa-arrow-circle-left" id="_btn-prev"></button>
        <button class="fa fa-arrow-circle-right" id="_btn-next"></button>
        <button class="fa fa-paint-brush" id="_btn-brush"></button>
        <button class="fa fa-compress" id="_btn-overview" data-toggle="fa fa-expand"></button>
    </div>
    <button class="fa fa-bars" id="_btn-bar"  data-toggle="fa fa-close"></button>
</div>
<script src="/js/mixjs/lib/mix.0.3.0.min.js"></script>
<script>
var base = location.protocol + '//' + location.host;
<%if (hasOwnProperty('generate') && generate) { %>
var path = (location.pathname + '#').split('/').filter(function(v){
    return !!v;
});
path.pop();
path = path.join('/');
MixJS.config({
    baseURL: [ base, path, 'js'].join('/')+'/'
});
<% }else{ %>
MixJS.config({
    baseURL: [ base, 'js'].join('/')+'/'
});
<% } %>
</script>
<script src="/js/mixjs/lib/event/broadcast.js"></script>
<script src="/js/nodeppt.js"></script>
<script>
Slide.init({
    containerID: 'container',
    drawBoardID: 'drawBoard',
    slideClass: '.slide',
    buildClass: '.build',
    progressID: 'progress',
    transition: '<%- transition %>',
    width: 1100,
    dir: './',
    <% if (query && query.controller === 'socket'){ %>
    control:{
        type: 'socket',
        args:{
            isControl: <% if (query.iscontroller) {%>true<%} else{%> false<%}%>,
            host: base,
            clientId: "<% if (query.clientid) {%><%-query.clientid%><%} else{%> 0<%}%>",
            //摇一摇
            shake: <% if (!query.noshake) {%>true<%} else{%> false<%}%>
        }
    },
    <% } else { %>
    //打开下面的注释就开启postMessage方式
    //访问网址127.0.0.1:8080/ppt/demo#client
    control:{
        type: 'postMessage',
        args:{
            isControl: <% if (query._multiscreen=='controller') {%>true<%} else{%> false<%}%>
        }
    },
    <% } %>
    tipID: 'tip'
});
MixJS.loadJS('highlight/highlight.pack.js',function(){
    hljs.tabReplace = '  ';
    hljs.initHighlightingOnLoad();
});
</script>
<%- files %>
<% if (usemathjax == 'yes'){ %>
<!-- MathJax -->
<script type="text/x-mathjax-config">
  MathJax.Hub.Config({
  config: ["TeX-AMS-MML_HTMLorMML.js"],
  tex2jax: {inlineMath: [['\\(','\\)']]}});
  //['$','$'], 避免货币价格冲突
</script>
<script type="text/javascript" src="/js/mathjax/MathJax.js"></script>
<% } %>
<!--placeholder-->
</body>
</html>
